<template>
  <div class="app-container">
    <el-form
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      v-show="showSearch"
      label-width="100px"
    >
      <el-form-item label="" prop="purchaseDocumentCode">
        <!-- <el-input
          v-model="queryParams.purchaseDocumentCode"
          placeholder="请输入MIS采购编码"
          clearable
          @keyup.enter.native="handleQuery"
        /> -->
        <el-select
          v-model="queryParams.purchaseDocumentCode"
          placeholder="MIS采购编码"
          clearable
          filterable
          @focus="getselectOrderNumber"
        >
          <el-option
            v-for="(dict, i) in purchaseDocumentCodeList"
            :key="i"
            :label="dict.label"
            :value="dict.label"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="" prop="storeName">
        <el-input
          v-model="queryParams.storeName"
          placeholder="请输入店铺名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="sku">
        <el-input
          v-model="queryParams.sku"
          placeholder="请输入sku"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="" prop="spu">
        <el-input
          v-model="queryParams.spu"
          placeholder="请输入spu"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="创建日期" prop="orderNumber">
        <el-date-picker
          v-model="value2"
          type="daterange"
          align="right"
          unlink-panels
          range-separator="-"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          :picker-options="pickerOptions"
          @change="changeTime"
          size="mini"
        >
        </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery"
          >搜索</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
          >重置</el-button
        >
        <el-button
          :icon="!isOpen ? 'el-icon-arrow-down' : 'el-icon-arrow-up'"
          size="mini"
          @click="shouqi"
          >展开/收起</el-button
        >
      </el-form-item>
      <div v-if="isOpen">
        <el-form-item label="数量" prop="quantityCount">
          <el-input
            v-model="queryParams.quantityCount"
            placeholder="请输入数量"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>

        <el-form-item label="颜色" prop="Color">
          <el-input
            v-model="queryParams.Color"
            placeholder="请输入颜色"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="尺码" prop="size">
          <el-input
            v-model="queryParams.size"
            placeholder="请输入尺码"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="仓库名称" prop="warehouseName">
          <el-input
            v-model="queryParams.warehouseName"
            placeholder="请输入仓库名称"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="店铺ID" prop="shopId">
          <el-input
            v-model="queryParams.shopId"
            placeholder="请输入店铺ID"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="平台店铺名称" prop="platformStoreName">
          <el-input
            v-model="queryParams.platformStoreName"
            placeholder="请输入平台店铺名称"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="创建人" prop="creator">
          <el-input
            v-model="queryParams.creator"
            placeholder="请输入创建人"
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <!-- <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery"
          >搜索</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
          >重置</el-button
        >
      </el-form-item> -->
      </div>
      <!-- <br />
      <el-form-item label="创建时间:" label-width="80px">
        <timeSearch
          @getDateArr="getDateArr"
          @changDay="changDay"
          :timeArr="timeArr"
          :dayActive="this.dayActive"
          :dayLimit="1095"
        />
      </el-form-item> -->
    </el-form>

    <!-- <el-row :gutter="20">
      
      <el-col :span="4" :xs="24">
        <el-card style="margin-top: 41px">
        
          <el-table :data="purchaseDocumentCodeList" @cell-click="tableEdit">
            <el-table-column label="MIS采购编码" align="center" prop="label" />
          </el-table>
        </el-card>
      </el-col>

      <el-col :span="20" :xs="24"> -->
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['productAllocation:secondary:add']"
          >新增</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['productAllocation:secondary:edit']"
          >修改</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['productAllocation:secondary:remove']"
          >删除</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['productAllocation:secondary:export']"
          >导出</el-button
        >
      </el-col>
      <!-- <el-col :span="1.5">
       
      </el-col> -->
      <el-col :span="1.5">
        <el-button size="mini" plain icon="el-icon-upload" @click="daoru"
          >导入</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button plain size="mini" @click="handleOrder">绑定</el-button>
      </el-col>
      <!-- <el-col :span="1.5">
        <el-button plain size="mini" @click="handlepurchaseDocumentCode"
          >选择MIS采购编码</el-button
        >
      </el-col> -->
      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"
      ></right-toolbar>
    </el-row>

    <!-- 添加或修改产品二级信息对话框 :on-change="handleChange"-->
    <el-dialog
      title="导入"
      :visible.sync="dialogVisible"
      width="500px"
      append-to-body
      v-if="dialogVisible"
    >
      <el-form label-width="150px">
        <el-form-item label="导入模板下载" prop="file">
          <el-button
            type="primary"
            plain
            size="mini"
            @click="downLoadTemplateFile"
            >导入模板下载</el-button
          >
        </el-form-item>
        <el-form-item label="导入文件" prop="file">
          <el-upload
            ref="daoru"
            :action="Upload.url"
            :headers="Upload.headers"
            :limit="limit"
            :on-exceed="handleExceed"
            :on-success="handlePictureSuccessPic"
            :before-upload="beforeAvatarUpload"
            :file-list="fileLi"
            :on-change="changeFile1"
          >
            <el-button size="mini" plain icon="el-icon-upload"
              >批量导入</el-button
            >

            <!-- <i class="el-icon-plus"></i> -->
          </el-upload>
        </el-form-item>
      </el-form>
    </el-dialog>

    <el-table
      v-loading="loading"
      :data="secondaryList"
      @selection-change="handleSelectionChange"
      :height="650"
    >
      <el-table-column type="selection" width="55" align="center" />
      <!-- <el-table-column label="id" align="center" prop="id" /> -->
      <el-table-column
        label="MIS采购编码"
        align="center"
        prop="purchaseDocumentCode"
      />
      <el-table-column label="店铺名称" align="center" prop="storeName" />
      <el-table-column label="sku" align="center" prop="sku" />
      <el-table-column label="数量" align="center" prop="quantityCount" />

      <el-table-column label="分配数量" align="center" prop="allocationQty" />
      <el-table-column label="在途数量" align="center" prop="inTransitQty" />
      <el-table-column
        label="采购订单状态"
        align="center"
        prop="purchaseOrderStatus"
      />
      <el-table-column label="spu" align="center" prop="spu" />
      <el-table-column label="skc" align="center" prop="skc" />
      <el-table-column label="颜色" align="center" prop="Color" />
      <el-table-column label="尺码" align="center" prop="size" />
      <el-table-column label="仓库名称" align="center" prop="warehouseName" />
      <el-table-column label="店铺ID" align="center" prop="shopId" />
      <el-table-column
        label="平台店铺名称"
        align="center"
        prop="platformStoreName"
      />
      <el-table-column label="备注" align="center" prop="remark" />
      <el-table-column label="创建人" align="center" prop="creator" />
      <el-table-column label="创建时间" align="center" prop="createTime" />
      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['productAllocation:secondary:edit']"
            >修改</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['productAllocation:secondary:remove']"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>

    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />
    <!-- </el-col>
    </el-row> -->

    <!-- 添加或修改渠道提报二级对话框 -->
    <el-dialog
      title="绑定关系"
      :visible.sync="openOrder"
      width="500px"
      append-to-body
      v-if="openOrder"
    >
      <el-form :model="formData" label-width="80px">
        <el-form-item label="" prop="purchaseDocumentCode">
          <el-select
            v-model="formData.tagType"
            style="width: 120px"
            @change="changecompareValue"
          >
            <el-option label="从原来订单选择" value="old" />
            <el-option label="生成新订单号" value="new" />
          </el-select>
          <!-- <el-input v-model="formData.purchaseDocumentCode" placeholder="MIS采购编码" /> -->
          <el-select
            :disabled="formData.tagType == 'new'"
            v-model="formData.purchaseDocumentCode"
            placeholder="MIS采购编码"
            clearable
            filterable
            @change="changepurchaseDocumentCode"
          >
            <el-option
              v-for="(dict, i) in purchaseDocumentCodeList"
              :key="i"
              :label="dict.label"
              :value="dict.label"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFormData">确 定</el-button>
        <!-- <el-button @click="cancel">取 消</el-button> -->
      </div>
    </el-dialog>
    <!-- 添加或修改渠道提报二级对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <!-- <el-form-item label="MIS采购编码" prop="purchaseDocumentCode">
          <el-input
            v-model="form.purchaseDocumentCode"
            placeholder="请输入MIS采购编码"
          />
        </el-form-item> -->
        <el-form-item label="店铺名称" prop="storeName">
          <!-- <el-input v-model="form.storeName" placeholder="请输入店铺名称" /> -->
          <el-select
            v-model="form.storeName"
            clearable
            filterable
            placeholder="店铺"
          >
            <el-option
              v-for="item in ShopInfoList"
              :key="item.comment"
              :label="`${item.comment}`"
              :value="item.comment"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="sku" prop="sku">
          <!-- <el-input v-model="form.sku" placeholder="请输入sku" /> -->
          <el-select
            v-model="form.sku"
            placeholder="请选择sku"
            filterable
            clearable
            allow-create
            remote
            :remote-method="getselectSkuLikeList"
          >
            <el-option
              v-for="(dict, index) in selectSkuLikeList"
              :key="index"
              :label="dict"
              :value="dict"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="数量" prop="quantityCount">
          <el-input v-model="form.quantityCount" placeholder="请输入数量" />
        </el-form-item>
        <!-- <el-form-item label="spu" prop="spu">
          <el-input v-model="form.spu" placeholder="请输入spu" />
        </el-form-item>
        <el-form-item label="颜色" prop="Color">
          <el-input v-model="form.Color" placeholder="请输入颜色" />
        </el-form-item>
        <el-form-item label="尺码" prop="size">
          <el-input v-model="form.size" placeholder="请输入尺码" />
        </el-form-item>
        <el-form-item label="仓库名称" prop="warehouseName">
          <el-input v-model="form.warehouseName" placeholder="请输入仓库名称" />
        </el-form-item>
        <el-form-item label="店铺ID" prop="shopId">
          <el-input v-model="form.shopId" placeholder="请输入店铺ID" />
        </el-form-item>
        <el-form-item label="平台店铺名称" prop="platformStoreName">
          <el-input
            v-model="form.platformStoreName"
            placeholder="请输入平台店铺名称"
          />
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input v-model="form.remark" placeholder="请输入备注" />
        </el-form-item>
        <el-form-item label="创建人" prop="creator">
          <el-input v-model="form.creator" placeholder="请输入创建人" />
        </el-form-item> -->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listSecondary,
  getSecondary,
  delSecondary,
  addSecondary,
  updateSecondary,
  generateOrderNumber,
  selectOrderNumber,
  editBatch,
} from "@/api/productAllocation/secondary";
import { JstShopInfo } from "@/api/conf/BiStoreWarehouseBinding";
//--------导入token
import { getToken } from "@/utils/auth";
import { downLoadTemplate } from "@/api/data/template";
import timeSearch from "@/views/chart/day/day.vue";
import moment from "moment";
import {
  listBiInventoryAgeDwd,
  getBiInventoryAgeDwd,
  delBiInventoryAgeDwd,
  addBiInventoryAgeDwd,
  updateBiInventoryAgeDwd,
  synData,
  inventoryAgeDetail,
  selectSkuLike,
  queryContentByKey,
} from "@/api/Warehouse/BiInventoryAgeDwd";
export default {
  name: "Secondary",
  components: { timeSearch },
  props: {
    row: {
      type: Object,
      default: () => {},
    },
    purchaseDocumentCode: {
      type: String,
      default: null,
    },
  },
  data() {
    return {
      selectSkuLikeList: [],
      checkpurchaseDocumentCode: "",
      list: [],
      dayActive: 365,
      timeArr: [
        { value: "2", label: "昨天" },
        { value: "7", label: "最近7天" },
        { value: "30", label: "最近30天" },
        { value: "365", label: "最近一年" },
        { value: "1", label: "日" },
      ],
      timeGap: { startTime: "", endTime: "" },
      ShopInfoList: [],
      openOrder: false,
      purchaseDocumentCodeList: [],
      fileLi: [],
      dialogVisible: false,
      limit: 2,
      Upload: {
        // 设置上传的请求头部
        headers: {
          header: { responseType: "blob" },

          Authorization: "Bearer " + getToken(),
        },
        // 图片上传的方法地址:
        url:
          process.env.VUE_APP_BASE_API +
          "/productAllocation/secondary/importData",
      },
      isOpen: false,
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 渠道提报二级表格数据
      secondaryList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        purchaseDocumentCode: null,
        storeName: null,
        sku: null,
        quantityCount: null,
        spu: null,
        Color: null,
        size: null,
        warehouseName: null,
        shopId: null,
        platformStoreName: null,
        creator: null,
      },
      // 表单参数
      form: {},
      // 表单参数
      formData: {
        tagType: "old",
      },
      // 表单校验
      rules: {},
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      value1: "",
      value2: "",
    };
  },
  created() {
    this.getList();
    this.getselectOrderNumber();
    JstShopInfo({ pageNum: 1, pageSize: 100 }).then((response) => {
      this.ShopInfoList = response.rows.map((item) => ({
        columnName: item.shopId,
        comment: item.shopName,
      }));
    });
  },
  watch: {
    purchaseDocumentCode: {
      handler: function (newnew, oldold) {
        this.queryParams.purchaseDocumentCode = this.purchaseDocumentCode;

        this.getList();
      },
      deep: true,
      immediate: true,
    },
    row: {
      handler: function (newnew, oldold) {
        this.queryParams.purchaseDocumentCode = this.row.purchaseDocumentCode;
        this.queryParams.sku = this.row.sku;
        this.getList();
      },
      deep: true,
      immediate: true,
    },
  },
  methods: {
    changeTime() {
      // console.log(JSON.stringify(this.value2));
      let m1 = moment(this.value2[0]).format("YYYY-MM-DD");
      let m2 = moment(this.value2[1]).format("YYYY-MM-DD");
      // console.log(JSON.stringify(m1));
      // console.log(JSON.stringify(m2));
      this.queryParams.startTime = m1;
      this.queryParams.endTime = m2;
    },
    tableEdit(row, column, cell, event) {
      this.checkpurchaseDocumentCode = row.purchaseDocumentCode;
      this.queryParams.purchaseDocumentCode = row.label;
      this.getList();
    },
    handlepurchaseDocumentCode() {
      // if (this.list.length != 1) {
      //   this.$modal.msgError("只勾选一条记录");
      //   return;
      // }
      this.$emit(
        "selectpurchaseDocumentCode",
        this.queryParams.purchaseDocumentCode
      );
    },
    //时间控件
    changDay(val) {
      this.dayActive = val;
      // this.timeGap.startTime = val[0];
      // this.timeGap.endTime = val[1];
    },
    getDateArr(value) {
      // this.timeGap.startTime = value[0];
      // this.timeGap.endTime = value[1];
      // console.log(JSON.stringify(this.timeGap));

      this.queryParams.startTime = value[0];
      this.queryParams.endTime = value[1];

      this.getList();

      this.dayActive = 1;
    },
    downLoadTemplateFile() {
      let obj = {
        templateName: "渠道库存采购提报表",
      };
      downLoadTemplate(obj).then((response) => {
        window.location.href =
          process.env.VUE_APP_BASE_API + response.rows[0].templateUrl;
      });
    },
    submitFormData() {
      let list = [];
      this.ids.forEach((item) => {
        list.push({
          id: item,
          purchaseDocumentCode: this.formData.purchaseDocumentCode,
        });
      });
      editBatch(list).then((response) => {
        if (response.code == 200) {
          this.$modal.msgSuccess("绑定成功");
        } else {
          this.$modal.msgError("绑定失败");
        }
        this.openOrder = false;
        this.getList();
      });
    },
    handleOrder() {
      if (this.ids.length < 1) {
        this.$modal.msgError("至少选择一条数据");
        return;
      } else {
        this.getselectOrderNumber();
        this.openOrder = true;
      }
    },
    changecompareValue() {
      //   this.formData.purchaseDocumentCode = null;
      if (this.formData.tagType == "new") {
        this.getgenerateOrderNumber();
      } else if (this.formData.tagType == "old") {
        this.getselectOrderNumber();
      }
    },
    changepurchaseDocumentCode() {
      this.$forceUpdate();
    },
    //生成新订单号
    getgenerateOrderNumber() {
      generateOrderNumber().then((response) => {
        this.formData.purchaseDocumentCode = response.rows[0];
        this.$forceUpdate();
      });
    },

    //从原来订单选择
    getselectOrderNumber() {
      selectOrderNumber().then((response) => {
        this.purchaseDocumentCodeList = [];
        response.rows.forEach((item) => {
          this.purchaseDocumentCodeList.push({ label: item });
        });

        this.formData.purchaseDocumentCode = "";
      });
    },
    getselectSkuLikeList(key) {
      selectSkuLike({ value: key }).then((response) => {
        this.selectSkuLikeList = response;
      });
    },
    //搜索栏展示与收起
    shouqi() {
      // console.log(1);
      this.isOpen = !this.isOpen;
    },
    /** 查询渠道提报二级列表 */
    getList() {
      this.loading = true;
      listSecondary(this.queryParams).then((response) => {
        this.secondaryList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        purchaseDocumentCode: null,
        storeName: null,
        sku: null,
        quantityCount: null,
        spu: null,
        Color: null,
        size: null,
        warehouseName: null,
        shopId: null,
        platformStoreName: null,
        remark: null,
        creator: null,
        createTime: null,
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.queryParams.pageSize = 10;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.queryParams = {};
      this.value2 = "";
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.id);
      this.list = selection.map((item) => item);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加渠道提报二级";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids;
      getSecondary(id).then((response) => {
        this.form = response.data;
        this.open = true;
        this.title = "修改渠道提报二级";
      });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.id != null) {
            updateSecondary(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addSecondary(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$modal
        .confirm('是否确认删除渠道提报二级编号为"' + ids + '"的数据项？')
        .then(function () {
          return delSecondary(ids);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        "productAllocation/secondary/export",
        {
          ...this.queryParams,
        },
        `secondary_${new Date().getTime()}.xlsx`
      );
    },
    //图片上传前的相关判断
    beforeAvatarUpload(file) {
      // const isJPG = file.type == 'image/jpeg' || file.type == 'image/png';
      const isLt2M = file.size / 1024 / 1024 < 100;
      // if (!isJPG) {
      //     this.$message.error('上传头像图片只能是 JPG/PNG 格式!');
      // }
      if (!isLt2M) {
        this.$message.error("上传导入文件大小不能超过 100MB!");
      }
      this.openUploadLoading();
      return isLt2M;
    },
    //图片预览
    handlePictureCardPreview(file) {
      this.picUrl = file.url;
      this.imageUrl = file.url;
      // this.dialogVisible = true;
    },
    //部门文件导入修改打开
    daoru() {
      this.dialogVisible = true;
    },
    // 打开加载层
    openUploadLoading() {
      this.$modal.loading("正在导入，请稍候！");
    },
    //文件导入成功回传

    handlePictureSuccessPic(response, file) {
      this.$refs.daoru.clearFiles(); //去掉文件列表
      this.$modal.closeLoading();
      console.log(JSON.stringify(file));
      console.log(JSON.stringify(response));
      this.dialogVisible = false;
      this.getList();

      if (response.code == 200) {
        this.$modal.msgSuccess("导入成功");
        //   this.getList();
      }

      // this.openmsg = true;
      // this.msg = response.msg;

      //设置图片访问路径 （url 后台传过来的的上传地址）
      // this.picUrl = file.response.url;
      // const url = file.response.fileName;
      // this.file = file.response.url;
      // console.log(JSON.stringify(this.file));
      // if (res.code == 200) {

      //   this.dialogVisible = false

      //   if (res.msg == '操作成功') {

      //     this.$modal.msgSuccess('导入成功')
      //   } else {
      //     this.$modal.msgError(res.msg);
      //   }
      //   this.getList();
      //   // return true
      // } else {
      //   this.$modal.msgError(res.msg);
      //   this.dialogVisible = true
      //   // this.$message.msgError('该颜色未在字典定义')
      //   return
      // }
    },

    // 文件个数超出
    handleExceed() {
      this.$modal.msgError(`上传链接文件数量不能超过 ${this.limit} 个!`);
    },
    // 上传文件让第二次覆盖第一的文件
    changeFile1(file, fileList) {
      if (fileList.length > 1) {
        this.fileLi = fileList.slice(-1);

        // this.fileList = [fileList[fileList.length - 1]]//这一步，是 展示最后一次选择文件
      }
      // this.fileSpecial = fileList;
    },
  },
};
</script>
